import React, { useState, useEffect } from 'react';
import { loc, is_empty, obj_empty, for_obj, obj_str, DlgBase, Btn } from 'sui';

const CkValue = ({ hcmd, open, value, setValue, des, setOpen }) => {
    const [main, setMain] = useState();

    useEffect(() => {
        if (!open || obj_empty(des) || obj_empty(value)) {
            return;
        }

        const ret = [];
        for_obj(des, (k,) => {
            let v = "" + value[k];
            if (!v) {
                return;
            }

            const tm = v.trim();
            if (v.length === tm.length) {
                return;
            }

            ret.push({k: k, v: v, done: false, des: des[k]});
        });

        setMain(ret);
    }, [open, value, des]);

    const hok = () => {
        let v = {};
        v = value;

        main.forEach(d => {
            if (v[d.k]) {
                v[d.k] = d.v;
            }
        });

        setOpen(false);
        setValue(v);
        hcmd();
    };

    const hfin = () => {
        let v = {};
        v = value;

        main.forEach(d => {
            if (v[d.k]) {
                v[d.k] = d.v.trim();
            }
        });

        setOpen(false);
        setValue(v);
        hcmd();
    };

    const hdel = (k) => {
        const tmp = [];
        main.forEach(d => {
            if (d.k === k) {
                tmp.push({
                    k: k,
                    v: d.v.trim(),
                    done: true,
                    des: d.des,
                });
            }
            else {
                tmp.push(d);
            }
        })

        setMain(tmp);
    };

    const hsave = (k) => {
        const tmp = [];
        main.forEach(d => {
            if (d.k === k) {
                tmp.push({
                    k: k,
                    v: d.v,
                    done: true,
                    des: d.des,
                })
            }
            else {
                tmp.push(d);
            }
        })

        setMain(tmp);
    };

    const getItem = () => {
        if (is_empty(main)) {
            return null;
        }

        return main.map(d => {
            const Action = () => {
                if (d.done) {
                    return null;
                }

                return (
                    <div>
                        <div className="table-cell px-2"><Btn hcmd={() => hdel(d.k)} color="green">{loc("l_237")}</Btn></div>
                        <div className="table-cell px-2"><Btn hcmd={() => hsave(d.k)}>{loc("l_497")}</Btn></div>
                    </div>
                );
            };

            return (
                <div className="table-row" key={d.k}>
                    <div className="text-right table-cell">{d.des}</div>
                    <div className="table-cell px-2">{obj_str(value, d.k)}</div>
                    <Action/>
                </div>
            );
        });
    };

    const getAction = () => {
        const disOk = () => {
            if (is_empty(main)) {
                return true;
            }

            const f = main.find(d => !d.done);
            if (f) {
                return true;
            }

            return false;
        };

        return (
            <div className="inline-flex">
                <Btn hcmd={() => setOpen(false)}>{loc("l_227")}</Btn>
                <Btn color="green" hcmd={hfin} className="ml-4">{loc("l_548")}</Btn>
                <Btn disabled={disOk()} hcmd={hok} className="ml-4">{loc("l_541")}</Btn>
            </div>
        );
    };

    return (
        <DlgBase open={open} title={loc("l_515")} action={getAction()}>
            {getItem()}
        </DlgBase>
    )
};

const useCheck = () => {
    const [open, setOpen] = useState(false);

    const hcheck = (value, ckdes, hcmd) => {
        if (obj_empty(ckdes)) {
            return;
        }

        if (obj_empty(value)) {
            return hcmd();
        }

        let ret = false;
        for_obj(ckdes, (k,) => {
            let v = "" + value[k];
            if (!v) {
                return;
            }

            let val = v.trim();
            if (val.length !== v.length) {
                ret = true;
            }
        });

        if (ret) {
            setOpen(true);
            return;
        }

        hcmd();
    };

    return [open, setOpen, hcheck];
};

export {useCheck, CkValue};
